<template>
	<div v-if="expressInfo" class="express">
		<div class="header">
      <span class="code"><span>快递单号：</span>{{ expressInfo.order.expresscode }}</span>
      <span class="express-name">{{ expressInfo.express.name }}</span>
    </div>
		<div class="list">
			<van-steps direction="vertical" :active="0">
				<van-step v-for="(item, index) in expressInfo.express.list" :key="index">
					<h4>{{ item.AcceptStation }}</h4>
					<p>{{ item.AcceptTime }}</p>
				</van-step>
			</van-steps>
		</div>
	</div>
</template>

<script setup>
const { proxy } = getCurrentInstance();
const business = proxy.$cookies.get('business');
const orderid = ref(proxy.$route.query.orderid);

const expressInfo = ref(null);

const getData = async () => {
	const res = await proxy.$GET({
		url: '/order/express',
		params: { busid: business.id, orderid: orderid.value },
	});

	console.log(res);

	if (res.code === 0) {
		proxy.$fail(res.msg);
		return;
	}

	expressInfo.value = res.data;
};

getData();
</script>

<style scoped lang="scss">
.express {
  margin: 5px;
	border-radius: 6px;
  overflow: hidden;
  
  .header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    background-color: #fff;
    border-bottom: 1px solid #eee;
    .code span{
      color: #999;
    }
  }
}
</style>
